<template>
  <div class="sider">
    <div class="loading" v-if="loading" v-show="!visitorVisit">
      <p v-html="loadingText"></p>
    </div>
    <Menu v-if="!loading" :open-names='openSubmenuList' :active-name="activeName">
      <Submenu v-for="item in menuList" :key="item.menuId" :name="item.menuId">
        <template slot="title">
          <Icon :type="item.iconcode" />
          {{item.menuName}}
        </template>
        <MenuItem v-for="em in item.children" :key="em.menuId"  :to="'/'+em.menuUrl" :name="'/'+em.menuUrl">{{em.menuName}}</MenuItem>
      </Submenu>
    </Menu>
    <Menu v-if="visitorVisit" :open-names="['home','myproject','memberCenter','messageCenter','about']" :active-name="activeName">
      <Submenu name="home">
        <template slot="title">
            <!-- <Icon type="ios-home-outline" /> -->
            首页
        </template>
        <MenuItem to="/index" name="/index">首页</MenuItem>
      </Submenu>
      <Submenu name="myproject">
        <template slot="title">
          <!-- <Icon type="ios-list" /> -->
          我的项目
        </template>
        <MenuItem to="/myproject/rojectProcedures/createProgram" name="/myproject/rojectProcedures">创建项目</MenuItem>
        <MenuItem to="/myproject/underway" name="/myproject/underway">正在进行</MenuItem>
        <MenuItem to="/myproject/projectQuery" name="/myproject/projectQuery">项目查询</MenuItem>
        <MenuItem to="/myproject/myProjectCheck" name="/myproject/myProjectCheck">我的审核</MenuItem>
        <MenuItem to="/myproject/myProjectArrange" name="/myproject/myProjectArrange">项目分配</MenuItem>
        <MenuItem to="/myproject/myProjectStock" name="/myproject/myProjectStock">项目库</MenuItem>
      </Submenu>
      <Submenu name="memberCenter">
        <template slot="title">
          <!-- <Icon type="ios-person" /> -->
          会员中心
        </template>
        <MenuItem to="/memberCenter/userHeartData" name="/memberCenter/userHeartData">机构基本资料</MenuItem>
        <MenuItem to="/memberCenter/userHeartInstall" name="/memberCenter/userHeartInstall">系统设置</MenuItem>
      </Submenu>
      <Submenu name="messageCenter">
        <template slot="title">
          <!-- <Icon type="ios-notifications" /> -->
          消息中心
        </template>
        <MenuItem to="/messageCenter/newHeart" name="/messageCenter/newHeart">信息</MenuItem>
      </Submenu>
      <Submenu name="about">
        <template slot="title">
          <!-- <Icon type="ios-alert-outline" /> -->
          关于我们
        </template>
        <MenuItem to="/about/aboutus" name="/about/aboutus">关于我们</MenuItem>
        <MenuItem to="/about/aboutUsAdvise" name="/about/aboutUsAdvise">问题反馈</MenuItem>
      </Submenu>
    </Menu>
    <div slot="trigger"></div>
    <Modal
        v-model="modal1"
        title="提示"
        @on-ok="userOrgOk">
        <p>您还不是企业用户，情先去安环家企业认证审核通过后再使用此工具</p>
    </Modal>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        loading: true,
        menuList: [],         //菜单列表
        openSubmenuList: [],  //展开子菜单集合
        activeName: this.$route.path, //激活菜单name
        visitorVisit: false,
        loadingText: '正在加载中...',
        modal1: false,
      }
    },
    watch: {
      '$route': function (to, from) {
        this.activeName = this.$route.path
        // this.openName = this.$route.meta.title
      }
    },
    created(){
      axios.get('/accountNumber/userOrg').then((res) => {
        localStorage.setItem('userOrg',res.type)
        if(res.type == 0){
          this.modal1 = true
        }
      })
    },
    mounted() {
      // 获取菜单
      this.$post('EaoGrid.Menu',{}).then(res=>{
        if(res._MESSAGE == "查询失败"){
          this.loadingText = '菜单查询失败'
        }
        if(res._STATUS==1) {
          this.loading = false
          // 展开子菜单集合
          this.openSubmenuList = res.menu.map(el=>{
            return el.menuId
          })
          this.menuList = res.menu
        }else {
          axios.get('/accountNumber/userOrg').then((res) => {
            console.log(res)
            if(res.type == "0"){
              this.visitorVisit = true
            }
            localStorage.setItem('userOrg',res.type)
          }).catch(err=>{
            this.$Message.warning('你没有权限访问此系统！')
            axios.get('/member/ajaxlogout').then(res=>{
              console.log(res)
              if(res.logout==true) {
                this.$router.push({'name': 'login'})
              }
            })
          })
        }
      }).catch(err=>{
        console.log(err)
        // 对于 错误 跳登录页
        this.$router.push({
          name: 'login'
        })
      })
    },
    methods: {
      userOrgOk(){

      },
    }

  }
</script>

<style lang="less">
  .sider {
    background: #025bb7 !important;
    color: #ffffff;

    .ivu-menu-light {
      background: #025bb7;
      color: #ffffff;
    }

    a {
      background: #ffffff;
      color: #515a6e;
      border-bottom: 1px solid #dedfe3;
    }
  }

  .ivu-menu-vertical.ivu-menu-light:after {
    width: 0px !important;
  }

  .ivu-layout-sider-zero-width-trigger {
    z-index: 10;
  }

  .ivu-menu {
    width: 100% !important;
  }

  .loading {
    text-align: center;
    margin-top: 10px;
  }
</style>